<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>作业详情</title>
<!--李缘龙-->
<link rel="stylesheet" href="public/css/lyl-text.css" />
<link rel="stylesheet" href="insdep/plus/easyui_plus.css" />
<!-- 主题模式  -->
<link rel="stylesheet" href="public/easyui/themes/default/easyui.css" />
<!-- 图标-->
<link rel="stylesheet" href="public/easyui/themes/icon.css" />
<link rel="stylesheet" href="public/css/app.css" />
<!-- js,顺序：jq,easyui,简中版 -->
<script src="public/js/jquery.min.js"></script>
<script src="public/easyui/jquery.easyui.min.js"></script>
<script src="public/easyui/locale/easyui-lang-zh_CN.js"></script>
</head>

<body class="fatherdiv">
<div class="nav">
					您好! 
					<a href="" class="">${userinfo.studentName}</a> 
					部门： <a>${classEntity.className}</a>
					 部门经理： <a>${monitor.studentName}</a> 
					 学分：
					<a href="javascript:loadXxx('stu/myscore.jsp')">[${userinfo.totalCredits}分]</a> 
					<a target="" class="" href="">[查看课表]</a> 
					<a id="qiantaipass" class="" href="qt-user-updatepass">[修改密码]</a> 
					<a class="" href="logout" onclick="return confirm('确定退出？')">[注销]</a>
	</div>
	<ul class="nav_head">
		<li>
			<div>
				<img src="public/images/xuexi.png" /> <a href="qiantai">快乐学习</a>
			</div>
		</li>
		<li>
			<div>
				<img src="public/images/quxian.png" /> <a href="qt-assessment">学习评估</a>
			</div>
		</li>
			<!-- <li>
			<div>
				<img src="public/images/rongyu.png" /> <a href="qt-my-honor">我的荣誉</a>
			</div>
		</li> 
		<li>
			<div>
				<img src="public/images/rizhi.png" /> <a
					href="qt-journal-recommend">教学日志</a>
			</div>
		</li>-->
		<li>
			<div>
				<img src="public/images/jihua.png" /> <a
					href="qt-learnplan-publish">学习计划</a>
			</div>
		</li>
		<li>
			<div>
				<img src="public/images/tuadui.png" /> <a
					href="qt-project-team">项目团队</a>
			</div>
		</li>
		<li>
			<div>
				<img src="public/images/jiuye.png" /> <a href="chaxuijingyan?id=-1">就业资讯</a>
			</div>
		</li>
	</ul>
	<!--头部上-->
	<div style="float: left; width: 97%; margin: 20px;">

		<div class="content_top">
			<h1 style="margin: 20px 0px 0px 10px;">${className }-${zuoye.zuoyeName }</h1>
			<form>
				<fieldset class="form_content_top" style=" border: 1px #DDD solid;">

					<legend>基本信息</legend>
					<div class="form_content_top_left" style="height: 300px;">
						<div id="container"
							style="height: 100%; -webkit-tap-highlight-color: transparent; user-select: none; position: relative; background: transparent;"
							_echarts_instance_="ec_1510900769369">
							<div class="assessment_div">
								<canvas class="canvas_cs" width="1120" height="886"
									data-zr-dom-id="zr_0"> </canvas>
							</div>
						</div>
					</div>
					<div class="form_content_top_right">
						<ul>
							<li><a style="font-size: 40px;">${gradeEntity.sumScore }</a></li>
							<li>【试卷名称】：${className }-${zuoye.zuoyeName }</li>
							<li>【出卷人】： ${userinfoName }</li>
							<li>【选择题数】：${fn:length(title1) }道题</li>
							<li>【判断题数】：${fn:length(title2) }道题</li>
							<li>【编程与简答题数】：${fn:length(title3) }道题</li>
							<li>【学习阶段】： 《${phaseEntity.phaseName }》</li>
							<li>【章节】： [${chapterEntity.chapterName }]</li>
							<li>【说明】：${zuoye.addPlus==''?'暂无':'zuoye.addPlus' }</li>
						</ul>
					</div>
				</fieldset>
			</form>
		</div>

		<div class="content_button">
			<!--选择题-->
			<div class="content_button_one">
				<h1 style="font-size: 15px; margin-top: 15px;">
					选择题<span>(共${fn:length(title1) }题) </span>
				</h1>
				<ol type="1">
					<c:forEach items="${title1 }" var="title1">
						<li>${title1.title } 
							<span style="margin-right: 20px;color: ${title1.titleType==title1.titleAnswer?'black':'red' }">${title1.titleType }</span>
						<c:if test="${title1.titleType!=title1.titleAnswer }">
							  正确答案：<span style="color: red;">${title1.titleAnswer }</span>
						</c:if>
						<c:if test="${title1.imageId!=null }">
						 <div style="margin-left: 2%;margin-top: 2px;">
								<span style="color: black;"> 效果如图所示：</span><br>
								<img style="width: 15%;height: 5%;margin-left: 2%;margin-top: 5px;" alt="" src="upload/${title1.imageId.imagePath }">
						</div>
					</c:if> 
							<ol type="A">
								<li>${title1.optionA }</li>
								<li>${title1.optionB }</li>
								<li>${title1.optionC }</li>
								<li>${title1.optionD }</li>
							</ol>
						</li>
					</c:forEach>
				</ol>
			</div>
			<!--判断题-->
			<div class="content_button_two" style="display: ${title2==null?'none':'block' }">
				<h1 style="font-size: 15px; margin-top: 15px;">
					判断题<span>(共${fn:length(title2)}题)</span>
				</h1>
				<ol type="1">
				<c:forEach items="${title2 }" var="title2" >
					<li>
					${title2.title }
					<span style="margin-left: 20px;color: ${title2.titleType==title2.titleAnswer?'black':'red' }">
						${title2.titleType }
					</span>
					<c:if test="${title2.titleType!=title2.titleAnswer}">
						(<span>正确答案：</span> <span style="color:red;">${title2.titleAnswer }</span>)
					</c:if>
					</li>
				</c:forEach>	
				</ol>
			</div>
			<!--编程题-->
			<div class="content_button_three">
				<h1 style="font-size: 15px; margin-top: 15px;">
					编程题<span>(共${fn:length(title3) }题)</span>
				</h1>
				<ol type="1">
				<c:forEach items="${title3 }" var="title3">
					<li><span>(得分: ${title3.delete }分) </span>${title3.title}
					 <c:if test="${title3.imageId!=null }">
						 <div style="margin-left: 2%;margin-top: 2px;">
								<span style="color: black;"> 效果如图所示：</span><br>
								<img style="width: 15%;height: 5%;margin-left: 2%;margin-top: 5px;" alt="" src="upload/${title3.imageId.imagePath }">
						</div>
					</c:if> 
						<div class="programming_div">
							<span style="color: red;">你的回答：</span>
							<div style="margin-left: 50px;">${title3.titleType }</div>
						</div>
					</li>
				</c:forEach>
				</ol>
				<c:if test="${gradeEntity.apprise!=null && gradeEntity.apprise !=''  }">
					<div style="margin-bottom : 30px;border: 1px dashed #CCC;margin-left:10px; padding-top: 10px;padding-left: 10p;height: 30px;">
						 教员评价：
						 	<span style="color: rgb(51,153,51);">
						 		${gradeEntity.apprise }
						 	</span>
					</div>
				</c:if>
			</div>
		</div>
	</div>
	<!--底部下-->
	<div class="home_page_bottom">
		<div class="botton_left">
			<img style="height: 50px; margin-left: 10px;"
				src="public/images/downloadlog.png" />
		</div>
		<div class="botton_right">
			<div>
				©2017<a style="color: gray;">中科韬睿</a> 版权所有 版本 Ver 1.1.8
			</div>
			<div>研发部技术总监 李赞红 郭华</div>
			<div>电话 18573308384 18673363711</div>
		</div>
	</div>
	<script type="text/javascript" src="public/js/echarts-all-3.js"></script>
	<script type="text/javascript">
	var dom = document.getElementById("container");
	var myChart = echarts.init(dom);
	var app = {};
	var studentNames=${studentNames};
	var studentScore=${studentScore};
	var className1=${className1 };
	option = null;
	option = {
		title: {
			text: '成绩评估统计图',
			subtext: className1
		},
		tooltip: {
			trigger: 'axis'
		},
		legend: {
			data: ['分数', '分数']
		},
		toolbox: {
			show: true,
			feature: {
				dataView: {
					show: true,
					readOnly: false
				},
				magicType: {
					show: true,
					type: ['line', 'bar']
				},
				restore: {
					show: true
				},
				saveAsImage: {
					show: true
				}
			}
		},
		calculable: true,
		xAxis: [{
			type: 'category',
			data: studentNames
		}],
		yAxis: [{
			type: 'value'
		}],
		series: [{
			name: '分数',
			type: 'bar',
			barCategoryGap : 180,
			data:studentScore,
			markPoint: {
				data: [{
						type: 'max',
						name: '最大值'
					},
					{
						type: 'min',
						name: '最小值'
					}
				]
			},
			markLine: {
				data: [{
					type: 'average',
					name: '平均值'
				}]
			}
		}, ]
	};;
	if(option && typeof option === "object") {
		myChart.setOption(option, true);
	}
	</script>
</body>
</html>